﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestFormly2.aspx.cs" Inherits="WebTest.TestFormly2" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <asp:PlaceHolder ID="PlaceHolder1" runat="server"> 
        <%: System.Web.Optimization.Scripts.Render("~/bundles/JQuery") %>          
        <%: System.Web.Optimization.Scripts.Render("~/bundles/JQueryUI") %>                
        <%: System.Web.Optimization.Styles.Render("~/bundles/Formly/css") %>
        <%: System.Web.Optimization.Scripts.Render("~/bundles/Formly") %>
    </asp:PlaceHolder>
          
<%--    <link type="text/css" rel="stylesheet" href="/Styles/bootstrap-datetimepicker.css" />
    <script type="text/javascript" lang="javascript" src="/Scripts/DalotsDateTimePicker/bootstrap-datetimepicker.js"></script>
    <script type="text/javascript" lang="javascript" src="Scripts/DalotsDateTimePicker/locales/bootstrap-datetimepicker.it.js"></script>--%>

    <script type="text/javascript" lang="javascript" src="/Scripts/Formly/FormlyHelper.js"></script>
    <script type="text/javascript" lang="javascript" src="/Scripts/GrayParrot.Core.js"></script> 
    <script type="text/javascript" lang="javascript" src="/Scripts/GrayParrot.AngularJS.Directives.FileUpload.js"></script> 
    <script type="text/javascript" lang="javascript" src="/Scripts/GrayParrot.AngularJS.Directives.DateTimePicker.js"></script>
    <script type="text/javascript" lang="javascript" src="/Scripts/GrayParrot.AngularJS.js"></script> 

    <script src="//npmcdn.com/angular-base64-upload@latest/dist/angular-base64-upload.js"></script>

    <title>Referto Errato</title>

      <style>
          body {
            margin: 10px
          }

          .formly-field {
            margin-bottom: 1px;
          }

          .formly.row{
            display:block;
          }

          .formly-field.section-label {
            margin-bottom: 8px
          }

        .btn-file {
            position: relative;
            overflow: hidden;
        }
        .btn-file input[type=file] {
            position: absolute;
            top: 0;
            right: 0;
            min-width: 100%;
            min-height: 100%;
            font-size: 100px;
            text-align: right;
            filter: alpha(opacity=0);
            opacity: 0;
            outline: none;
            background: white;
            cursor: inherit;
            display: block;
        }
      </style>
</head>

<body>

    <div ng-app="formlyExample" ng-controller="MainCtrl as vm" id="divFormly" name="divFormly">
                                <div ng-if="vm.loadingData.$$state.status === 0" style="margin:20px 0;font-size:2em">
                                    <strong>Loading...</strong>
                                </div>
                                <div ng-if="vm.loadingData.$$status.state !== 0">
                                    <form ng-submit="vm.onSubmit()" novalidate id="form2">
                                        <formly-form model="vm.model" fields="vm.fields" form="vm.form">
                                        <button type="sumbit" class="btn btn-primary submit-button" ng-disabled="vm.form.$invalid">Invia</button> <!-- ng-click="ok()" -->
                                        </formly-form>
                                    </form>
                                </div>

                            <h2>Form Data</h2>
                    <pre>{{vm.model | json}}</pre>
                    <br />
                    <h2>Form Fields</h2>
                    <pre>{{vm.fields | json}}</pre>
                    <br />



    </div>

</body>

   <script>
       // http://stackoverflow.com/questions/27863434/upload-file-using-webapi-ajax
       var itMoment = moment();
       itMoment.lang('it')

       var m_imgData = null;

       var settings = new FormlySettings();
       settings.container = '#divFormly';
       //settings.shortcutCallback = DoSubmit;
       settings.setLoad(settings.createGetConfig('/api/Test/LoadFields'));
       settings.setSend(settings.createPostConfig('/api/Test/CambioData'));

       FormlyManager(settings);

       function CheckCallback() {
           alert('DoCheck');
       }

       function ChangeCallback(options, scope) {
           alert('DoCheck on change');
       }

       function ShowImg(options, scope) {
           var inputf = $('#FotoArticolo');

           var inputf2 = $('#FotoArticolo').context.activeElement;

           readURL(inputf2);
       }

       function readURL(input) {
           if (input.files && input.files[0]) {
               var reader = new FileReader();

               reader.onload = function (e) {
                   m_imgData = e.target.result;
                   $('#img2').attr('src', e.target.result);
               }

               reader.readAsDataURL(input.files[0]);
           }
       }

   </script>

</html>